<template>
  <el-descriptions :column="2" border title="学生信息">
    <el-descriptions-item label="学号">
      <span>{{ student.studentId }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="姓名">
      <span>{{ student.name }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="地址">
      <span>{{ student.address }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="邮箱">
      <span>{{ student.email }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="电话">
      <span>{{ student.phone }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="性别">
      <span>{{ student.sex == 0 ? '男' : '女' }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="出生日期">
            <span>
                {{
                student.birthDay instanceof Date ? student.birthDay.toLocaleDateString() : student.birthDay.substr(0, 10)
              }}
            </span>
    </el-descriptions-item>
    <el-descriptions-item label="学校">
      <span>{{ student.school }}</span>
    </el-descriptions-item>
  </el-descriptions>
  <el-divider/>
  <el-descriptions :column="3" border class="des" title="求职信息">
    <el-descriptions-item label="工作年限">
      <span>{{ resume.workYear.length == 0 ? "未填写" : resume.workYear + '年' }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="求职意向">
      <span>{{ resume.targetJob.length == 0 ? "未填写" : resume.targetJob }}</span>
    </el-descriptions-item>
    <el-descriptions-item label="薪资要求(元)">
      <span>{{ resume.targetSalary == 0 ? "未填写" : resume.targetSalary }}</span>
    </el-descriptions-item>
    <el-descriptions-item :span="3" label="技能特长">
      <span>{{ resume.skills.length == 0 ? "未填写" : resume.skills }}</span>
    </el-descriptions-item>
    <el-descriptions-item :span="3" label="荣誉证书">
      <span>{{ resume.honoraryCertificate.length == 0 ? "未填写" : resume.honoraryCertificate }}</span>
    </el-descriptions-item>
    <el-descriptions-item :span="3" label="兴趣爱好">
      <span>{{ resume.hobbies.length == 0 ? "未填写" : resume.hobbies }}</span>
    </el-descriptions-item>
    <el-descriptions-item :span="3" label="自我评价">
      <span>{{ resume.selfEvaluation.length == 0 ? "未填写" : resume.selfEvaluation }}</span>
    </el-descriptions-item>
  </el-descriptions>
  <el-divider/>
  <div>
    <p class="des-title">教育背景</p>
    <div v-for="ed in resume.educationalBackgroundsList" :key="ed.id">
      <el-descriptions :column="2" border class="des">
        <el-descriptions-item label="学校">
          <span>{{ ed.school }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="专业">
          <span>{{ ed.major }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="入学时间">
          <span>{{ ed.startYear.substr(0, 10) }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="毕业时间">
          <span>{{ ed.endYear.substr(0, 10) }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="学历">
          <span>{{ ed.degree }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="详情">
          <div>{{ ed.description }}</div>
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
  <el-divider/>
  <div>
    <p class="des-title">项目经验</p>
    <div v-for="pe in resume.projectExperiencesList" :key="pe.id">
      <el-descriptions :column="2" border class="des">
        <el-descriptions-item label="项目名称">
          <span>{{ pe.name }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="担任角色">
          <span>{{ pe.role }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="开始时间">
                    <span>{{
                        pe.startTime instanceof Date ? pe.startTime.toLocaleDateString() : pe.startTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="结束时间">
                    <span>{{
                        pe.endTime instanceof Date ? pe.endTime.toLocaleDateString() : pe.endTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="详情">
          <div>{{ pe.description }}</div>
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
  <el-divider/>
  <div>
    <p class="des-title">校园经历</p>
    <div v-for="ce in resume.campusExperiencesList" :key="ce.id">
      <el-descriptions :column="2" border class="des">
        <el-descriptions-item label="名称">
          <span>{{ ce.name }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="担任角色">
          <span>{{ ce.role }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="开始时间">
                    <span>{{
                        ce.startTime instanceof Date ? ce.startTime.toLocaleDateString() : ce.startTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="结束时间">
                    <span>{{
                        ce.endTime instanceof Date ? ce.endTime.toLocaleDateString() : ce.endTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="详情">
          <div>{{ ce.description }}</div>
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
  <el-divider/>
  <div>
    <p class="des-title">实习经历</p>
    <div v-for="ie in resume.internshipExperiencesList" :key="ie.id">
      <el-descriptions :column="2" border class="des">
        <el-descriptions-item label="公司名称">
          <span>{{ ie.enterpriseName }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="岗位">
          <span>{{ ie.position }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="开始时间">
                    <span>{{
                        ie.startTime instanceof Date ? ie.startTime.toLocaleDateString() : ie.startTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="结束时间">
                    <span>{{
                        ie.endTime instanceof Date ? ie.endTime.toLocaleDateString() : ie.endTime.substr(0, 10)
                      }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="详情">
          <div>{{ ie.description }}</div>
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
  <el-divider/>
</template>

<script lang="ts" setup>
import {onMounted, reactive, watch} from "vue";
import type {ResponseInterface, ResumeVOInterface, StudentInterface} from "@/model/type";
import {getResumeVO} from "@/api/ResumeAPI";

const props = defineProps({
  flash: Number,
});

const resume = reactive<ResumeVOInterface>({
  campusExperiencesList: [],
  educationalBackgroundsList: [],
  hobbies: "",
  honoraryCertificate: "",
  id: "",
  internshipExperiencesList: [],
  projectExperiencesList: [],
  selfEvaluation: "",
  skills: "",
  studentId: "",
  targetJob: "",
  targetSalary: 0,
  workYear: 0
})
const resumeId = localStorage.getItem("resumeId")
const student: StudentInterface = JSON.parse(localStorage.getItem("user"))
watch(() => props.flash,
    async () => {
      const r: ResponseInterface = await getResumeVO(resumeId, localStorage.getItem("token")!)
      if (r.code == 200) {
        Object.assign(resume, r.data)
      }
    }
)
onMounted(async () => {
  const r: ResponseInterface = await getResumeVO(resumeId, localStorage.getItem("token")!)
  if (r.code == 200) {
    Object.assign(resume, r.data)
  }
})
</script>

<style scoped>
.des {
  margin-top: 20px;
}

.des-title {
  font-size: 16px;
  font-weight: 700;
}
</style>